<template>
	<div>
		<el-form label-width="80px" :model="upload.params">
			<el-form-item label="文件名称">
				<el-input v-model="upload.params.title" class="element-width" placeholder="填写文件名称"></el-input>
			</el-form-item>

			<el-form-item label="获得时间" prop="receiveTime">
				<el-date-picker class="element-width" v-model="upload.params.receiveTime" type="date"
					placeholder="选择获得时间">
				</el-date-picker>
			</el-form-item>
			<!-- <el-form-item label="永久有效">
				<el-switch v-model="upload.params.isLong"></el-switch>
			</el-form-item> -->
			<el-form-item label="失效时间" prop="endTime">
				<el-date-picker class="element-width" v-model="upload.params.endTime" type="date" placeholder="选择失效时间">
				</el-date-picker>
			</el-form-item>

			<el-form-item label="是否合格" prop="isQualified">
				<el-radio-group v-model="upload.params.isQualified">
					<el-radio label="1" value="1">合格</el-radio>
					<el-radio label="0" value="0">不合格</el-radio>
				</el-radio-group>
			</el-form-item>
			<el-form-item label="备注说明">
				<el-input v-model="upload.params.remark" class="element-width" type="textarea" placeholder="填写备注说明">
				</el-input>
			</el-form-item>
		</el-form>

		<div style="padding: 0 36px">
			<el-upload accept=".pdf" :limit="1" :multiple="false" :file-list="upload.fileList" action="#" drag
				:auto-upload="false" :on-change="changeFile" :on-remove="removeFile" :on-exceed="uploadFileOver">
				<i class="el-icon-upload"></i>
				<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
			</el-upload>
		</div>
		<div slot="footer" class="dialog-footer" style="text-align: center!important;margin-top: 20px;">
			<el-button type="primary" size="small" @click="save()" :loading="isLoading">确 定</el-button>
			<el-button size="small" @click="cancle">取 消</el-button>
		</div>
	</div>
</template>

<script>
	import $ from 'jquery'

	let that
	let APPKEY = '5da5441f62e48aedc7a3853ffc75c2db';
	let PRODID = 'gf';
	let UPLOAD_ACTION = '/upload';
	let VIEW_ACTION = '/view';
	let REMOVE_ACTION = '/remove';
	let IMGURL = 'https://www.weifeibangbang.com/wfbb-webupload/service/sys/file/upload';
	export default {
		name: 'app',
		components: {},
		props: ['selectItem'],
		data() {
			return {
				isLoading: false,
				params: {
					facilitatorId: '',
					categoryMainId: '',
					ticketId: '',
					itemId: ''
				},
				upload: {
					file: '',
					fileList: [],
					visible: false,
					params: {
						id: '', // 档案id
						facilitatorId: '', // 客户id
						categoryItemId: '', // 子类id
						title: '', // 标题
						fileId: '', // 文件id
						remark: '', // 注释
						endTime: '', // 到期时间
						isQualified: '1', //是否合格
						isLong: false,
						receiveTime: '',
					}
				},
			}
		},
		created: function() {},
		mounted: function() {
			that = this
			that.params.facilitatorId = that.getQueryString("facilitatorId")
			that.params.categoryMainId = that.getQueryString("categoryMainId")
			that.params.ticketId = that.$store.state.token
			that.params.itemId = that.getQueryString("itemId")
		},
		methods: {
			cancle() {
				that.$emit("cancle", true)
			},

			uploadFileOver(files, fileList) {
				return this.$message({
					message: '请上传文件数量已超出，点击删除后重新上传文件',
					type: 'warning'
				});
			},

			changeFile: function(file, fileList) {
				var _this = this;
				file.url = URL.createObjectURL(file.raw);
				if (file.raw.type.indexOf("pdf") == -1) {
					return this.$message({
						message: '请上传pdf文件',
						type: 'warning'
					});
				}
				_this.upload.fileList = fileList
				_this.upload.file = file;
			},

			removeFile() {
				this.upload.fileList = []
				this.upload.file = ''
			},

			uploadFile: function(callback) {
				var _this = this;
				var formdata = new FormData()
				formdata.append("file", _this.upload.file.raw);
				formdata.append("appKey", APPKEY);
				formdata.append("businessCode", that.randomChar(19));
				formdata.append("prodID", PRODID);
				$.ajax({
					url: IMGURL + '/upload',
					data: formdata,
					type: 'POST',
					dataType: 'json',
					contentType: false,
					processData: false,
					success: function(result) {
						var fileId = result.message.fileID;
						callback(fileId);
					},
					error: function() {}
				})
			},

			randomChar: function(l) {
				var x = "0123456789qwertyuioplkjhgfdsazxcvbnm";
				var tmp = "";
				var timestamp = new Date().getTime();
				for (var i = 0; i < l; i++) {
					tmp += x.charAt(Math.ceil(Math.random() * 100000000) % x.length);
				}
				return timestamp + tmp;
			},


			save() {
				let that = this
				if (that.upload.file == '') {
					return this.$message({
						message: '请上传文件',
						type: 'warning'
					});
				} else if (that.upload.title == '') {
					return this.$message({
						message: '请填写标题',
						type: 'warning'
					});
				}
				that.isLoading = true
				that.uploadFile(function(fileId) {
					that.ajax({
						url: '/document/saveOrUpdateDocumentEntCategoryRecord?ticketId=' + that.params
							.ticketId,
						dataType: 'json',
						contentType: 'application/json',
						data: JSON.stringify({
							facilitatorId: that.params.facilitatorId,
							categoryItemId: that.selectItem.id,
							title: that.upload.params.title,
							remark: that.upload.params.remark,
							fileId: fileId,
							receiveTime: that.upload.params.receiveTime,
							endTime: that.upload.params.endTime,
							isQualified: Number(that.upload.params.isQualified) ? true : false
						}),
						success: function(result) {
							that.upload = that.$options.data().upload
							that.isLoading = false
							that.$emit("success", true)
							return that.$message({
								message: '保存成功',
								type: 'success'
							});
						}
					})
				})
			},

		},
	}
</script>

<style>
</style>
